/**
 * 该mxin文件只存储基本方法，用于任意vue文件引入，禁止加入created，mounted等生命周期
 * ==============================================================================
 */
import { isObject, getCssStyle, getServerImgUrlByIcon } from '@/utils/util';

// 将函数抽离getCssStyle函数，防止多次赋值，浪费内存
const _dealObjStyleVal = (style, s, i, componentStyle) => {
  // 颜色对象 backgroundColor: { light: '#fff', dark: '#0D263A' }
  if (s[componentStyle]) {
    style[i] = s[componentStyle];
    return;
  }

  // 宽度对象 _width: { switch: false, value: 100 }
  if (i.indexOf('_') === 0) {
    const _key = i.substr(1);
    if (typeof s.switch === 'boolean') {
      if (s.switch) {
        style[_key] = s.value;
      } else {
        delete style[_key];
      }
    }
  }
};

export default {
  data() {
    return {
      dfCssStyle: null, // 防止vue3报错
    };
  },

  methods: {

    // 获取css样式，可自适应根据窗口宽度改变宽高
    getCssStyle(key, dfStyle = {}) {
      let style = dfStyle;
      if (isObject(key)) {
        style = key; // 传过来的是样式对象
      } else {
        if (!this.config) {
          return {};
        }
        const { property } = this.config.config;
        if (property.cssStyle && property.cssStyle[key]) {
          style = property.cssStyle[key];
        }

        // 默认css样式
        const dfCssStyle = this.dfCssStyle && this.dfCssStyle[key];
        if (dfCssStyle) {
          const componentStyle = this.getComponentStyle();
          style = { ...dfCssStyle, ...style };

          Object.entries(style).map(([i]) => {
            // 兼容老组件 标题样式 backgroundColor为''的情况
            let s = style[i];
            if (key === 'title' && i === 'backgroundColor' && s === '') {
              s = dfCssStyle[i];
            }
            if (s && isObject(s)) {
              _dealObjStyleVal(style, s, i, componentStyle);
            }
          });
        }
      }
      style = getCssStyle(style);
      if (key === 'title') {
        style.paddingTop = `${style.paddingTop} !important`;
      }
      return style;
    },

    // 注释
    getComponentStyle() {
      let compStl = 'light';
      if (this.config && this.config.config && this.config.config.property) {
        compStl = this.config.config.property.componentStyle;
      }
      return compStl;
    },
  },
};
